<template>
  <el-table :data="tableData.slice((currentPage4 - 1) * size, currentPage4 * size)">
    <el-table-column
      label="课程ID"
      prop="kechengid"
      width="190"
    ></el-table-column>
    <el-table-column
      label="课程名称"
      prop="kcname"
      width="290"
    ></el-table-column>
    <el-table-column
      label="任课教师姓名"
      prop="jiaoshiname"
      width="290"
    ></el-table-column>
    <el-table-column
      label="任课教师编号"
      prop="renkejiaoshi"
      width="200"
    ></el-table-column>
    <el-table-column align="right">
      <template #header>
        <el-input
          v-model="search"
          size="mini"
          placeholder="输入课程名称关键字后单击回车搜索"
          @keyup.enter="mohuchaxun"
        />
      </template>
    </el-table-column>
  </el-table>
  <div class="block">
    <span class="demonstration"></span>
    <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage4"
      :page-sizes="[10,25]"
      :page-size="size"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total"
    >
    </el-pagination>
  </div>
</template>

<script>
const axios = require("axios");
export default {
  name: "teacher_chaxunkecheng",
  data() {
    return {
       total: 0,
      size: 10,
      currentPage4: 1,
      search: "",
      tb: "",
      value1: "",
      value2: "",
      dialogFormVisible: false,
      formLabelWidth: "120px",
      tableData: [
        {
          kechengid: "",
          kcname: "",
          jiaoshiname: "",
          renkejiaoshi: "",
        },
      ],
    };
  },
  methods: {
    handleSizeChange: function (size) {
      this.size = size;
    },
    handleCurrentChange: function (currentPage4) {
      this.currentPage4 = currentPage4;
    },
    mohuchaxun() {
      let _this = this;
      axios
        .get("https://localhost:44391/api/teacher/mohukechengsuoyou", {
          params: {
            mohu: _this.search,
          },
        })
        .then(function (response) {
          console.log(response);
          _this.tableData = response.data;
        });
    },
    chaxun() {
      let _this = this;
      console.log(_this.tb);
      if (_this.tb == "") {
        _this.$router.push({ path: "/" });
      } else {
        axios
          .get("https://localhost:44391/api/teacher/chaxunkechengshitu")
          .then(function (response) {
            console.log(response.data);
            _this.tableData = response.data;
             _this.total = response.data.length;
          });
      }
    },
  },
  mounted() {
    this.tb = this.$store.state.t_bianhao;
    this.chaxun();
  },
};
</script>

<style scoped>
h1 {
  font-size: 40px;
}
</style>